<template>
    <div
    class="previewDiv"
    >
        <mavon-editor 
        class="mavonEditor_preview"
        :toolbarsFlag=false
        defaultOpen=preview
        :subfield=false
        v-model="docContentPreview"
        />
    </div>

</template>

<script>
import { mavonEditor } from 'mavon-editor'
import homeVue from '../user/home.vue'
const markdownIt = mavonEditor.getMarkdownIt()
export default {
    data(){
        return {
            docName:'',
            docContent:'',
            docContentPreview:'',
            userId:'',
        }
    },  
    props:{
        docId: {
            type: Number, // 指定类型为数字
            required: true,
        },
        archiveId: {
            type: Number, // 指定类型为数字
            required: true,
        },
    },
    created(){
        this.userId=localStorage.getItem('userId');
    },
    mounted(){
        //第一步，得到docList,由此得到doc的其他数据
        this.$axios.get('http://localhost:8001/doc/getUserArchiveDoc', {params: {
            userId:this.userId,
            archiveId:this.archiveId
        }}).then(res => {
            for(var doc_info of res.data){
                if(doc_info.docId==this.docId){
                    this.docName=doc_info.docName;
                    this.docContentPreview=doc_info.docContent;
                    break;
                }
            }
        }).catch(err => {
            console.log(err);
            this.docContentPreview=err;
        });
        console.log('内容获取完毕');
    },
}
</script>

<style>
.previewDiv{
    position: fixed;
    left: 2%;
    right: 2%;
    width: 96%;
    height: 100%;
}
.mavonEditor_preview{
    min-height: 88%;
}
</style>